<style type="text/css">
    .container{
        margin: 20px;
    }
    
    #category-tree{
        color: #000;
    }
</style>

<?php
echo CHtml::button(Yii::t('main', 'OK'), array('id'=>'btnok', 'style'=>'margin-bottom:10px; padding: 0px 15px'));

$treeData=$model->getTreeData($id);

$this->widget('CTreeView', array(
    'id'=>'category-tree',
    'data'=>$treeData['nodes'],
    'animated'=>'normal',
    'collapsed'=>true,
    'htmlOptions'=>array(
        'class'=>'filetree'
    )
));
?>

<script type="text/javascript">
    $(function(){
        
        var categorySelector=window.opener.document.getElementById('Product_categoryId');
        
        $('#btnok').click(function(){
            window.close();
        });
        
        $('#category-tree').find('li').each(function(){
            if($(this).children().length===0){
                $(this).click(function(){
                    $(categorySelector).val($(this).attr('id').replace('node_', ''));
                    $('#category-tree').find('li').css({'background-color':'transparent', 'color':'#000'});
                    $(this).css({'background-color': '#008db8', 'color':'#fff'});
                    //window.close();
                });
            }
        });
        
        <?php if($id){ ?>
        $('li#node_<?php echo $id ?>').css({'background-color': '#008db8', 'color':'#fff'});
        <?php } ?>
    });
</script>
